<template>
  <div class="app-container">
    <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="工业企业" name="one">
        <div>
          <el-form
            :model="queryParams"
            ref="queryForm"
            size="small"
            :inline="true"
            v-show="showSearch"
            label-width="68px"
          >
            <el-form-item label="企业名称" prop="newName">
              <el-input
                v-model="queryParams.newName"
                placeholder="请输入企业名称"
                clearable
                @keyup.enter.native="handleQuery"
              />
            </el-form-item>
            <el-form-item label="所属行业" prop="industry">
              <el-select
                v-model="queryParams.industry"
                placeholder="请选择所属行业"
                clearable
              >
                <el-option
                  v-for="dict in dict.type.customer_industry"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="收发类型" prop="sendReceiveType">
              <el-select
                v-model="queryParams.sendReceiveType"
                placeholder="请选择收发类型"
                clearable
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button
                type="primary"
                icon="el-icon-search"
                size="mini"
                @click="handleQuery"
                >搜索</el-button
              >
              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
                >重置</el-button
              >
            </el-form-item>
          </el-form>

          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-plus"
                size="mini"
                @click="handleAdd"
                >申请合作</el-button
              >
            </el-col>
            <right-toolbar
              :showSearch.sync="showSearch"
              @queryTable="getList"
            ></right-toolbar>
          </el-row>

          <el-table
            v-loading="loading"
            :data="managementList"
            @selection-change="handleSelectionChange"
            height="400"
            :row-style="{ height: '30px' }"
            border
            :cell-style="{ padding: '0px' }"
            highlight-current-row
          >
            <el-table-column
              label="序号"
              type="index"
              align="center"
              prop="index"
              :index="indexMethod"
            ></el-table-column>
            <el-table-column
              label="企业名称"
              align="center"
              prop="newName"
              min-width="220"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <!-- 使用按钮作为可点击元素，并绑定点击事件 -->
                <el-button
                  size="small"
                  v-if="scope.row.state == '2'"
                  @click="handleLook(scope.row.newId)"
                  type="text"
                  class="no-wrap"
                >
                  {{ scope.row.newName }}
                </el-button>
                <el-button
                  size="small"
                  v-else
                  type="text"
                  style="color: black"
                  class="no-wrap"
                >
                  {{ scope.row.newName }}
                </el-button>
              </template>
            </el-table-column>
            <el-table-column
              label="企业联系人"
              align="center"
              prop="contacts"
              width="100"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="联系电话"
              align="center"
              prop="phone"
              width="110"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="企业性质"
              align="center"
              prop="nature"
              width="110"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.enterprise_nature"
                  :value="scope.row.nature"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="所属行业"
              align="center"
              prop="industry"
              width="150"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.customer_industry"
                  :value="scope.row.industry"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="合作理由"
              align="center"
              prop="cooperationReason"
              width="200"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="状态"
              align="center"
              prop="state"
              width="70"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.collaborative_state"
                  :value="scope.row.state"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="收发类型"
              align="center"
              width="80"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <div
                  size="small"
                  type="text"
                  v-if="scope.row.initiatorId == $store.state.user.info.orgId"
                >
                  我发起的
                </div>
                <div
                  size="small"
                  type="text"
                  v-if="scope.row.recipientId == $store.state.user.info.orgId"
                >
                  我接收的
                </div>
              </template>
            </el-table-column>
            <el-table-column
              label="操作"
              align="center"
              class-name="small-padding fixed-width"
              width="130"
            >
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  @click="handleDelete(scope.row)"
                  title="删除"
                  v-if="scope.row.state == '1'"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  style="color: gray"
                  v-if="scope.row.state != '1'"
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  @click="handleEdit(scope.row)"
                  v-if="scope.row.state == '2'"
                  title="修改"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  style="color: gray"
                  v-if="scope.row.state != '2'"
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-check"
                  @click="handleSubmit(scope.row)"
                  title="提交"
                  v-if="
                    scope.row.state == '3' &&
                    scope.row.initiatorId == $store.state.user.info.orgId
                  "
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-user"
                  @click="handleExamine(scope.row)"
                  title="审核"
                  v-if="
                    scope.row.state == '1' &&
                    scope.row.recipientId == $store.state.user.info.orgId
                  "
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-user"
                  style="color: gray"
                  v-if="
                    scope.row.state != '1' ||
                    scope.row.recipientId != $store.state.user.info.orgId
                  "
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-check"
                  style="color: gray"
                  v-if="
                    (scope.row.state == '3' &&
                      scope.row.recipientId == $store.state.user.info.orgId) ||
                    scope.row.state != '3'
                  "
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-view"
                  @click="handleView(scope.row)"
                  title="查看"
                ></el-button>
              </template>
            </el-table-column>
          </el-table>
          <pagination
            v-show="total > 0"
            :total="total"
            :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize"
            @pagination="getList"
          />
        </div>
      </el-tab-pane>
      <el-tab-pane label="服务机构" name="two">
        <div>
          <el-form
            :model="queryParamsTwo"
            ref="queryFormTwo"
            size="small"
            :inline="true"
            v-show="showSearch"
            label-width="68px"
          >
            <el-form-item label="企业名称" prop="newName">
              <el-input
                v-model="queryParamsTwo.newName"
                placeholder="请输入企业名称"
                clearable
                @keyup.enter.native="handleQueryTwo"
              />
            </el-form-item>
            <el-form-item label="所属行业" prop="industry">
              <el-select
                v-model="queryParamsTwo.industry"
                placeholder="请选择所属行业"
                clearable
              >
                <el-option
                  v-for="dict in dict.type.customer_industry_serve"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="收发类型" prop="sendReceiveType">
              <el-select
                v-model="queryParamsTwo.sendReceiveType"
                placeholder="请选择收发类型"
                clearable
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button
                type="primary"
                icon="el-icon-search"
                size="mini"
                @click="handleQueryTwo"
                >搜索</el-button
              >
              <el-button
                icon="el-icon-refresh"
                size="mini"
                @click="resetQueryTwo"
                >重置</el-button
              >
            </el-form-item>
          </el-form>

          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-plus"
                size="mini"
                @click="handleAdd"
                >申请合作</el-button
              >
            </el-col>
            <right-toolbar
              :showSearch.sync="showSearch"
              @queryTable="getTwoList"
            ></right-toolbar>
          </el-row>

          <el-table
            v-loading="loading"
            :data="managementTwoList"
            height="400"
            :row-style="{ height: '30px' }"
            border
            :cell-style="{ padding: '0px' }"
            highlight-current-row
          >
            <el-table-column
              label="序号"
              type="index"
              align="center"
              prop="indexTwo"
              :index="indexMethodTwo"
            ></el-table-column>
            <el-table-column
              label="企业名称"
              align="center"
              prop="newName"
              min-width="220"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <!-- 使用按钮作为可点击元素，并绑定点击事件 -->
                <el-button
                  size="small"
                  v-if="scope.row.state == '2'"
                  @click="handleLook(scope.row.newId)"
                  type="text"
                  class="no-wrap"
                >
                  {{ scope.row.newName }}
                </el-button>
                <el-button
                  size="small"
                  v-else
                  type="text"
                  style="color: black"
                  class="no-wrap"
                >
                  {{ scope.row.newName }}
                </el-button>
              </template>
            </el-table-column>
            <el-table-column
              label="企业联系人"
              align="center"
              prop="contacts"
              width="100"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="联系电话"
              align="center"
              prop="phone"
              width="110"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="企业性质"
              align="center"
              prop="nature"
              width="110"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.enterprise_nature"
                  :value="scope.row.nature"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="所属行业"
              align="center"
              prop="industry"
              width="150"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.customer_industry_serve"
                  :value="scope.row.industry"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="合作理由"
              align="center"
              prop="cooperationReason"
              width="200"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="状态"
              align="center"
              prop="state"
              width="70"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.collaborative_state"
                  :value="scope.row.state"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="收发类型"
              align="center"
              width="80"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <div
                  size="small"
                  type="text"
                  v-if="scope.row.initiatorId == $store.state.user.info.orgId"
                >
                  我发起的
                </div>
                <div
                  size="small"
                  type="text"
                  v-if="scope.row.recipientId == $store.state.user.info.orgId"
                >
                  我接收的
                </div>
              </template>
            </el-table-column>

            <el-table-column
              label="操作"
              align="center"
              class-name="small-padding fixed-width"
              width="130"
            >
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  @click="handleDelete(scope.row)"
                  title="删除"
                  v-if="scope.row.state == '1'"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  style="color: gray"
                  v-if="scope.row.state != '1'"
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  @click="handleEdit(scope.row)"
                  title="修改"
                  v-if="scope.row.state == '2'"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  style="color: gray"
                  v-if="scope.row.state != '2'"
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-check"
                  @click="handleSubmit(scope.row)"
                  title="提交"
                  v-if="
                    scope.row.state == '3' &&
                    scope.row.initiatorId == $store.state.user.info.orgId
                  "
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-user"
                  @click="handleExamine(scope.row)"
                  title="审核"
                  v-if="
                    scope.row.state == '1' &&
                    scope.row.recipientId == $store.state.user.info.orgId
                  "
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-user"
                  style="color: gray"
                  v-if="
                    scope.row.state != '1' ||
                    scope.row.recipientId != $store.state.user.info.orgId
                  "
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-check"
                  style="color: gray"
                  v-if="
                    (scope.row.state == '3' &&
                      scope.row.recipientId == $store.state.user.info.orgId) ||
                    scope.row.state != '3'
                  "
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-view"
                  @click="handleView(scope.row)"
                  title="查看"
                ></el-button>
              </template>
            </el-table-column>
          </el-table>
          <pagination
            v-show="total2 > 0"
            :total="total2"
            :page.sync="queryParamsTwo.pageNum"
            :limit.sync="queryParamsTwo.pageSize"
            @pagination="getTwoList"
          />
        </div>
      </el-tab-pane>
      <el-tab-pane label="园区平台" name="three">
        <div>
          <el-form
            :model="queryParamsThree"
            ref="queryFormThree"
            size="small"
            :inline="true"
            v-show="showSearch"
            label-width="68px"
          >
            <el-form-item label="企业名称" prop="newName">
              <el-input
                v-model="queryParamsThree.newName"
                placeholder="请输入企业名称"
                clearable
                @keyup.enter.native="handleQueryThree"
              />
            </el-form-item>
            <el-form-item label="所属行业" prop="industry">
              <el-select
                v-model="queryParamsThree.industry"
                placeholder="请选择所属行业"
                clearable
              >
                <el-option
                  v-for="dict in dict.type.customer_industry_garden"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="收发类型" prop="sendReceiveType">
              <el-select
                v-model="queryParamsThree.sendReceiveType"
                placeholder="请选择收发类型"
                clearable
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button
                type="primary"
                icon="el-icon-search"
                size="mini"
                @click="handleQueryThree"
                >搜索</el-button
              >
              <el-button
                icon="el-icon-refresh"
                size="mini"
                @click="resetQueryThree"
                >重置</el-button
              >
            </el-form-item>
          </el-form>

          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-plus"
                size="mini"
                @click="handleAdd"
                >申请合作</el-button
              >
            </el-col>
            <right-toolbar
              :showSearch.sync="showSearch"
              @queryTable="getThreeList"
            ></right-toolbar>
          </el-row>

          <el-table
            v-loading="loading"
            :data="managementThreeList"
            height="400"
            :row-style="{ height: '30px' }"
            border
            :cell-style="{ padding: '0px' }"
            highlight-current-row
          >
            <el-table-column
              label="序号"
              type="index"
              align="center"
              prop="indexTwo"
              :index="indexMethodTwo"
            ></el-table-column>
            <el-table-column
              label="企业名称"
              align="center"
              min-width="220"
              prop="newName"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <!-- 使用按钮作为可点击元素，并绑定点击事件 -->
                <el-button
                  size="small"
                  v-if="scope.row.state == '2'"
                  @click="handleLook(scope.row.newId)"
                  type="text"
                  class="no-wrap"
                >
                  {{ scope.row.newName }}
                </el-button>
                <el-button
                  size="small"
                  v-else
                  type="text"
                  style="color: black"
                  class="no-wrap"
                >
                  {{ scope.row.newName }}
                </el-button>
              </template>
            </el-table-column>
            <el-table-column
              label="企业联系人"
              align="center"
              prop="contacts"
              width="100"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="联系电话"
              align="center"
              prop="phone"
              width="110"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="企业性质"
              align="center"
              prop="nature"
              width="110"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.enterprise_nature"
                  :value="scope.row.nature"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="所属行业"
              align="center"
              prop="industry"
              width="150"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.customer_industry_garden"
                  :value="scope.row.industry"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="合作理由"
              align="center"
              prop="cooperationReason"
              width="200"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="状态"
              align="center"
              prop="state"
              width="70"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.collaborative_state"
                  :value="scope.row.state"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="收发类型"
              align="center"
              width="80"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <div
                  size="small"
                  type="text"
                  v-if="scope.row.initiatorId == $store.state.user.info.orgId"
                >
                  我发起的
                </div>
                <div
                  size="small"
                  type="text"
                  v-if="scope.row.recipientId == $store.state.user.info.orgId"
                >
                  我接收的
                </div>
              </template>
            </el-table-column>
            <el-table-column
              label="操作"
              align="center"
              class-name="small-padding fixed-width"
              width="130"
            >
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  @click="handleDelete(scope.row)"
                  title="删除"
                  v-if="scope.row.state == '1'"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  style="color: gray"
                  v-if="scope.row.state != '1'"
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  @click="handleEdit(scope.row)"
                  title="修改"
                  v-if="scope.row.state == '2'"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  style="color: gray"
                  v-if="scope.row.state != '2'"
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-check"
                  @click="handleSubmit(scope.row)"
                  title="提交"
                  v-if="
                    scope.row.state == '3' &&
                    scope.row.initiatorId == $store.state.user.info.orgId
                  "
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-user"
                  @click="handleExamine(scope.row)"
                  title="审核"
                  v-if="
                    scope.row.state == '1' &&
                    scope.row.recipientId == $store.state.user.info.orgId
                  "
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-user"
                  style="color: gray"
                  v-if="
                    scope.row.state != '1' ||
                    scope.row.recipientId != $store.state.user.info.orgId
                  "
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-check"
                  style="color: gray"
                  v-if="
                    (scope.row.state == '3' &&
                      scope.row.recipientId == $store.state.user.info.orgId) ||
                    scope.row.state != '3'
                  "
                  disabled="disabled"
                ></el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-view"
                  @click="handleView(scope.row)"
                  title="查看"
                ></el-button>
              </template>
            </el-table-column>
          </el-table>
          <pagination
            v-show="total3 > 0"
            :total="total3"
            :page.sync="queryParamsThree.pageNum"
            :limit.sync="queryParamsThree.pageSize"
            @pagination="getThreeList"
          />
        </div>
      </el-tab-pane>
    </el-tabs>

    <!-- 添加或修改【请填写功能名称】对话框 -->
    <el-dialog
      title="企业选择"
      :visible.sync="open"
      width="1250px"
      append-to-body
    >
      <el-row>
        <el-col>
          <el-form
            :model="queryEnterpriseParams"
            ref="queryFormEnterprise"
            size="small"
            :inline="true"
            v-show="showSearch"
            label-width="100px"
          >
            <el-form-item label="企业名称" prop="deptName">
              <el-input
                v-model="queryEnterpriseParams.deptName"
                placeholder="请输入企业名称"
                clearable
                @keyup.enter.native="handleQueryEnterprise"
              />
            </el-form-item>
            <!-- <el-form-item label="所属行业" prop="industry">
                            <el-select v-model="queryEnterpriseParams.industry" placeholder="请选择所属行业" clearable>
                                <el-option v-for="dict in dict.type.customer_industry" :key="dict.value"
                                    :label="dict.label" :value="dict.value" />
                            </el-select>
                        </el-form-item> -->
            <el-form-item label="机构类型" prop="companyType">
              <el-select
                v-model="queryEnterpriseParams.companyType"
                placeholder="请选择合作类型"
              >
                <el-option
                  v-for="dict in dict.type.sys_org_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="产品名称" prop="productName">
              <el-input
                v-model="queryEnterpriseParams.productName"
                placeholder="请输入产品名称"
                clearable
                @keyup.enter.native="handleQueryEnterprise"
              />
            </el-form-item>
            <el-form-item>
              <el-button
                type="primary"
                icon="el-icon-search"
                size="mini"
                @click="handleQueryEnterprise"
                >搜索</el-button
              >
              <el-button
                icon="el-icon-refresh"
                size="mini"
                @click="resetQueryEnterprise"
                >重置</el-button
              >
              <el-button
                type="primary"
                size="mini"
                @click="saveSelectEnterprise"
                >确定</el-button
              >
            </el-form-item>
          </el-form>
          <el-table
            ref="tableEnterprise"
            v-loading="loading"
            style="width: 100%"
            @selection-change="handleSelectionChangeEnterprise"
            :data="deptList"
          >
            <el-table-column
              type="selection"
              width="45"
              align="center"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="企业名称"
              align="center"
              prop="deptName"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <!-- 使用按钮作为可点击元素，并绑定点击事件 -->
                <el-button
                  size="small"
                  @click="handleSee(scope.row.deptId)"
                  type="text"
                >
                  {{ scope.row.deptName }}
                </el-button>
              </template>
            </el-table-column>
            <el-table-column
              label="产品名称"
              align="center"
              prop="productName"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="企业联系人"
              width="100"
              align="center"
              prop="contacts"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="联系电话"
              width="100"
              align="center"
              prop="phone"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="企业性质"
              width="100"
              align="center"
              prop="nature"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  :options="dict.type.enterprise_nature"
                  :value="scope.row.nature"
                />
              </template>
            </el-table-column>
            <el-table-column
              label="所属行业"
              align="center"
              prop="industry"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                <dict-tag
                  v-show="scope.row.companyType == 0"
                  :options="dict.type.customer_industry"
                  :value="scope.row.industry"
                />
                <dict-tag
                  v-show="scope.row.companyType == 1"
                  :options="dict.type.customer_industry_serve"
                  :value="scope.row.industry"
                />
                <dict-tag
                  v-show="scope.row.companyType == 2"
                  :options="dict.type.customer_industry_garden"
                  :value="scope.row.industry"
                />
              </template>
            </el-table-column>
          </el-table>
          <pagination
            v-show="total1 > 0"
            :total="total1"
            :page.sync="queryEnterpriseParams.pageNum"
            :limit.sync="queryEnterpriseParams.pageSize"
            @pagination="getDeptList"
          />
          <el-row style="margin-top: 30px">
            <el-form ref="form" :model="form" label-width="80px">
              <el-form-item
                label="合作理由"
                prop="cooperationReason"
                label-width="80px"
              >
                <el-input
                  v-model="form.cooperationReason"
                  type="textarea"
                  :rows="3"
                  maxlength="1000"
                  placeholder=" 请输入合作理由"
                />
              </el-form-item>
            </el-form>
          </el-row>
        </el-col>
      </el-row>
    </el-dialog>
    <el-dialog
      :title="title"
      :visible.sync="openExamine"
      width="800px"
      append-to-body
    >
      <div>
        <el-form
          ref="formReview"
          :model="formReview"
          :inline="true"
          :rules="reviewRules"
          v-if="reviewView"
        >
          <el-row>
            <el-col>
              <el-form-item
                label="合作理由"
                prop="collaborativeReason"
                label-width="110px"
              >
                <el-input
                  v-model="collaborativeReason"
                  type="textarea"
                  :rows="4"
                  disabled="disabled"
                  style="width: 567px"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row style="line-height: 2px">
            <el-col style="margin-left: 20px">
              <el-form-item
                label="评审结果"
                prop="reviewResult"
                label-width="90px"
              >
                <template>
                  <el-radio v-model="formReview.reviewResult" label="0"
                    >同意</el-radio
                  >
                  <el-radio v-model="formReview.reviewResult" label="1"
                    >不同意</el-radio
                  >
                </template>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col>
              <el-form-item
                label="评审意见"
                prop="reviewComments"
                label-width="110px"
              >
                <el-input
                  v-model="formReview.reviewComments"
                  type="textarea"
                  placeholder="请输入内容"
                  :rows="4"
                  style="width: 567px"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <el-row>
          <el-table v-loading="loading" :data="reviewList">
            <el-table-column
              label="评审人"
              align="center"
              prop="reviewer"
              width="150"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="评审结果"
              align="center"
              prop="reviewResult"
              width="80"
              :formatter="formatterResult"
            />
            <el-table-column
              label="评审意见"
              align="center"
              prop="reviewComments"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              label="评审时间"
              align="center"
              prop="reviewTime"
              width="100"
            >
              <template slot-scope="scope">
                <span>{{
                  parseTime(scope.row.reviewTime, "{y}-{m}-{d}")
                }}</span>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
        <div style="text-align: center; margin-top: 15px">
          <el-button type="primary" @click="submitReviewForm" v-if="reviewView"
            >保 存</el-button
          >
          <el-button @click="cancel">关 闭</el-button>
        </div>
      </div>
    </el-dialog>
    <el-dialog
      title="查看企业信息"
      :visible.sync="openAdmin"
      width="900"
      append-to-body
    >
      <el-form ref="formDept" :model="formDept" label-width="80px">
        <el-row>
          <el-col :span="12" style="height: 35px">
            <el-form-item label="企业名称:" prop="deptName" label-width="120px">
              {{ formDept.deptName }}
            </el-form-item>
          </el-col>
          <el-col :span="12" style="height: 35px">
            <el-form-item label="企业性质:" prop="nature" label-width="120px">
              {{ formatterNature(formDept.nature) }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12" style="height: 35px">
            <el-form-item label="所属行业:" prop="industry" label-width="120px">
              {{ formatterIndustry(formDept.industry, formDept.companyType) }}
            </el-form-item>
          </el-col>

          <el-col :span="12" style="height: 35px">
            <el-form-item
              label="法人代表:"
              prop="legalPerson"
              label-width="120px"
            >
              {{ formDept.legalPerson }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12" style="height: 35px">
            <el-form-item
              label="注册资金:"
              prop="registeredFund"
              label-width="120px"
            >
              {{ formDept.registeredFund }}(万元)
            </el-form-item>
          </el-col>
          <el-col :span="12" style="height: 35px">
            <el-form-item
              label="成立时间:"
              prop="foundTime"
              label-width="120px"
            >
              {{ formDept.foundTime }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12" style="height: 35px">
            <el-form-item label="联系人:" prop="contacts" label-width="120px">
              {{ formDept.contacts }}
            </el-form-item>
          </el-col>
          <el-col :span="12" style="height: 35px">
            <el-form-item label="联系电话:" prop="phone" label-width="120px">
              {{ formDept.phone }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12" style="height: 35px">
            <el-form-item
              label="统一社会信用代码:"
              prop="creditCode"
              label-width="120px"
            >
              {{ formDept.creditCode }}
            </el-form-item>
          </el-col>
          <el-col :span="12" style="height: 35px">
            <el-form-item label="行政区域:" prop="area" label-width="120px">
              {{ formDept.area }}
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="24" style="height: 35px">
            <el-form-item label="企业地址:" prop="address" label-width="120px">
              {{ formDept.address }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item
              label="个性签名:"
              prop="personalSignature"
              label-width="120px"
            >
              {{ formDept.personalSignature }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24" style="margin-top: -24px">
            <el-form-item
              label="经营范围:"
              prop="businessScope"
              label-width="120px"
            >
              {{ formDept.businessScope }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24" style="margin-top: -24px">
            <el-form-item
              label="企业介绍:"
              prop="companyProfile"
              label-width="120px"
            >
              {{ formDept.companyProfile }}
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancelDept">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listManagement,
  listManagementType,
  getManagement,
  listManagementTwo,
  delManagement,
  addManagement,
  updateManagement,
} from "@/api/collaborative/management";
import { listDeptTwo, listDeptType, getDept } from "@/api/system/dept";
import { listApproval, addApproval } from "@/api/collaborative/approval";
import { listArea, getArea } from "@/api/area/area";
import FileView from "@/components/FileView/index";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  name: "Management",
  components: { FileView, Treeselect },
  dicts: [
    "enterprise_nature",
    "sys_normal_disable",
    "customer_industry",
    "customer_industry_serve",
    "customer_industry_garden",
    "sys_dept_type",
    "sys_org_type",
    "enterprise_source",
    "collaborative_state",
    "sys_org_type",
  ],
  data() {
    return {
      activeName: "one",
      fileType: 2,
      fileType1: 2,
      openAdmin: false,
      disabledOne: true,
      disabledTwo: true,
      refreshKey: 0,
      collaborativeReason: "",
      reviewView: true,
      // 选中数组
      eIds: [],
      eName: [],
      index: null,
      indexTwo: null,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      cId: "",
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      total1: 0,
      total2: 0,
      total3: 0,
      // 【请填写功能名称】表格数据
      managementList: [],
      managementTwoList: [],
      managementThreeList: [],
      deptList: [],
      reviewList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      openExamine: false,
      options: [
        {
          value: "0",
          label: "我发起的",
        },
        {
          value: "1",
          label: "我接收的",
        },
      ],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 15,
        industry: null,
        newName: null,
        sendReceiveType: null,
        collaborativeId: null,
        companyType: null,
        initiatorId: null,
        initiatorName: null,
        recipientId: null,
        recipientName: null,
        cooperationReason: null,
        state: null,
        createId: null,
        createName: null,
        operateTime: null,
        operateId: null,
        operateName: null,
        departmentId: null,
        departmentName: null,
        organizationId: null,
        organizationName: null,
        belongTo: null,
      },
      queryParamsTwo: {
        pageNum: 1,
        pageSize: 15,
        industry: null,
        newName: null,
        sendReceiveType: null,
        collaborativeId: null,
        initiatorId: null,
        initiatorName: null,
        companyType: null,
        recipientId: null,
        recipientName: null,
        cooperationReason: null,
        state: null,
        createId: null,
        createName: null,
        operateTime: null,
        operateId: null,
        operateName: null,
        departmentId: null,
        departmentName: null,
        organizationId: null,
        organizationName: null,
        belongTo: null,
      },
      queryParamsThree: {
        pageNum: 1,
        pageSize: 15,
        industry: null,
        newName: null,
        sendReceiveType: null,
        collaborativeId: null,
        initiatorId: null,
        initiatorName: null,
        companyType: null,
        recipientId: null,
        recipientName: null,
        cooperationReason: null,
        state: null,
        createId: null,
        createName: null,
        operateTime: null,
        operateId: null,
        operateName: null,
        departmentId: null,
        departmentName: null,
        organizationId: null,
        organizationName: null,
        belongTo: null,
      },
      queryParamsType: {
        pageNum: 1,
        pageSize: 15,
        collaborativeId: null,
        initiatorId: null,
        initiatorName: null,
        companyType: null,
        recipientId: null,
        recipientName: null,
        cooperationReason: null,
        state: null,
        createId: null,
        createName: null,
        operateTime: null,
        operateId: null,
        operateName: null,
        departmentId: null,
        departmentName: null,
        organizationId: null,
        organizationName: null,
        belongTo: null,
      },
      queryEnterpriseParams: {
        pageNum: 1,
        pageSize: 5,
        productName: null,
        companyType: null,
        industry: null,
        deptName: null,
      },
      queryReviewParams: {
        pageNum: 1,
        pageSize: 15,
        reviewId: null,
        collaborativeId: null,
        reviewerId: null,
        reviewer: null,
        reviewResult: null,
        reviewComments: null,
        reviewTime: null,
      },
      // 表单参数
      form: {},
      formDept: {},
      formReview: {},
      // 表单校验
      rules: {},
      reviewRules: {
        reviewComments: [
          { required: true, message: "评审意见不能为空", trigger: "blur" },
          { max: 1000, message: "评审意见长度不能超过1000", trigger: "blur" },
        ],
      },
    };
  },
  created() {
    this.getList();
    this.getTwoList();
    this.getThreeList();
    this.getType();
  },
  methods: {
    handleClick(tab, event) {
      if (tab.name == "one") {
        this.resetQuery();
      }
      if (tab.name == "two") {
        this.resetQueryTwo();
      }
      if (tab.name == "three") {
        this.resetQueryThree();
      }
    },
    formatterNature(value) {
      var type = "";
      this.dict.type.enterprise_nature.forEach(item => {
        if (item.value == value) type = item.label;
      });
      return type;
    },
    formatterIndustry(value, index) {
      var type = "";
      if (index == "0") {
        this.dict.type.customer_industry.forEach(item => {
          if (item.value == value) type = item.label;
        });
      }
      if (index == "1") {
        this.dict.type.customer_industry_serve.forEach(item => {
          if (item.value == value) type = item.label;
        });
      }
      if (index == "2") {
        this.dict.type.customer_industry_garden.forEach(item => {
          if (item.value == value) type = item.label;
        });
      }
      return type;
    },
    resetDept() {
      this.formDept = {
        deptId: null,
        parentId: null,
        ancestors: null,
        deptName: null,
        type: "1",
        companyOrigin: null,
        abbreviate: null,
        registeredFund: null,
        legalPerson: null,
        companyType: "0",
        nature: null,
        creditCode: null,
        area: null,
        foundTime: null,
        businessScope: null,
        industry: null,
        contacts: null,
        address: null,
        orderNum: null,
        personalSignature: null,
        leader: null,
        phone: null,
        email: null,
        status: "0",
        fileId: null,
        delFlag: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
        isCertified: null,
        reviewComments: null,
      };
      this.resetForm("formDept");
    },
    handleLook(enterpriseId) {
      this.$router.push("/collaborative/detail/" + enterpriseId);
    },
    handleSee(row) {
      this.resetDept();
      this.businessId = row;
      this.fileType = 1;
      this.fileType1 = 1;
      this.refreshKey++;
      getDept(row).then(response => {
        this.formDept = response.data;
        this.deptType = response.data.type;
        getArea(this.formDept.area).then(response => {
          var areaList = response.data;
          if (areaList != undefined) {
            this.formDept.area = response.data.areaName;
          }
        });
        this.fileType = 2;
        this.fileType1 = 2;
      });
      setTimeout(() => {
        this.openAdmin = true;
      }, 300);
    },
    cancelDept() {
      this.openAdmin = false;
    },
    handleAddOther() {
      this.openOtherAdd = true;
    },
    handleTest() {
      this.openOther = true;
    },
    getType() {
      this.queryParamsType.organizationId = this.$store.state.user.info.orgId;
      this.queryParamsType.companyType = "0";
      listManagementType(this.queryParamsType).then(response => {
        console.log(response);
      });
    },
    area() {
      listArea({}).then(response => {
        this.options = response.data;
      });
    },
    normalizer(node) {
      if (node.children && !node.children.length) {
        delete node.children;
      }
      return {
        id: node.areaId,
        label: node.areaName,
        isDisabled: false,
        children: node.list,
      };
    },
    /** 查询【请填写功能名称】列表 */
    getList() {
      this.loading = true;
      this.queryParams.companyType = "0";
      listManagement(this.queryParams).then(response => {
        this.managementList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    getTwoList() {
      this.loading = true;
      this.queryParamsTwo.companyType = "1";
      listManagement(this.queryParamsTwo).then(response => {
        this.managementTwoList = response.rows;
        this.total2 = response.total;
        this.loading = false;
      });
    },
    getThreeList() {
      this.loading = true;
      this.queryParamsThree.companyType = "2";
      listManagement(this.queryParamsThree).then(response => {
        this.managementThreeList = response.rows;
        this.total3 = response.total;
        this.loading = false;
      });
    },
    getDeptList() {
      if (this.$store.state.user.info.companyType == "0") {
        listDeptType(this.queryEnterpriseParams).then(response => {
          this.deptList = response.rows;
          this.total1 = response.total;
        });
      } else {
        listDeptTwo(this.queryEnterpriseParams).then(response => {
          this.deptList = response.rows;
          this.total1 = response.total;
        });
      }
    },
    getReviewList() {
      this.queryReviewParams.collaborativeId = this.cId;
      listApproval(this.queryReviewParams).then(response => {
        this.reviewList = response.rows;
      });
    },
    // 取消按钮
    cancel() {
      this.openExamine = false;
      this.resetReview();
    },
    formatterResult(row, column, cellValue, index) {
      var result = "";
      if (row.reviewResult == "0") {
        result = "同意";
      } else {
        result = "不同意";
      }
      return result;
    },
    // 表单重置
    reset() {
      this.form = {
        collaborativeId: null,
        initiatorId: null,
        initiatorName: null,
        recipientId: null,
        recipientName: null,
        cooperationReason: null,
        state: null,
        createId: null,
        createName: null,
        createTime: null,
        operateTime: null,
        operateId: null,
        operateName: null,
        departmentId: null,
        departmentName: null,
        organizationId: null,
        organizationName: null,
        belongTo: null,
        delFlag: null,
      };
      this.resetForm("form");
    },
    resetReview() {
      this.formReview = {
        reviewId: null,
        collaborativeId: null,
        reviewerId: null,
        reviewer: null,
        reviewResult: null,
        reviewComments: null,
        reviewTime: null,
      };
      this.resetForm("formReview");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    handleQueryTwo() {
      this.queryParamsTwo.pageNum = 1;
      this.getTwoList();
    },
    /** 重置按钮操作 */
    resetQueryTwo() {
      this.resetForm("queryFormTwo");
      this.handleQueryTwo();
    },
    handleQueryThree() {
      this.queryParamsThree.pageNum = 1;
      this.getThreeList();
    },
    /** 重置按钮操作 */
    resetQueryThree() {
      this.resetForm("queryFormThree");
      this.handleQueryThree();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.collaborativeId);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.resetForm("queryFormEnterprise");
      this.queryEnterpriseParams.pageNum = 1;
      this.queryEnterpriseParams.pageSize = 5;
      this.getDeptList();
      setTimeout(() => {
        this.open = true;
      }, 600);
    },

    handleSubmit(row) {
      const collaborativeIds = row.collaborativeId;
      this.$confirm(
        '是否继续提交与"' + row.recipientName + '"的合作申请？',
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(() => {
          const data = {
            sign: "begin",
            collaborativeId: collaborativeIds,
          };
          updateManagement(data).then(response => {
            this.$modal.msgSuccess("操作成功");
            this.getList();
            this.getTwoList();
            this.getThreeList();
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消保存",
          });
        });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const collaborativeIds = row.collaborativeId || this.ids;
      this.$modal
        .confirm('是否确认撤销与"' + row.recipientName + '"的合作申请？')
        .then(function () {
          return delManagement(collaborativeIds);
        })
        .then(() => {
          this.getList();
          this.getTwoList();
          this.getThreeList();
          this.$modal.msgSuccess("撤销成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleView(row) {
      this.title = "合作查看";
      this.reviewView = false;
      this.cId = row.collaborativeId;
      this.getReviewList();
      this.openExamine = true;
    },
    handleEdit(row) {
      this.reviewView = true;
      const collaborativeIds = row.collaborativeId;
      this.$confirm('是否终止与"' + row.newName + '"的合作？', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          const data = {
            sign: "end",
            collaborativeId: collaborativeIds,
          };
          updateManagement(data).then(response => {
            this.$modal.msgSuccess("操作成功");
            this.getList();
            this.getTwoList();
            this.getThreeList();
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消保存",
          });
        });
    },
    handleExamine(row) {
      this.title = "合作审核";
      this.resetReview();
      this.formReview.reviewResult = "0";
      this.reviewView = true;
      this.cId = row.collaborativeId;
      this.getReviewList();
      getManagement(this.cId).then(response => {
        this.collaborativeReason = response.data.cooperationReason;
      });
      this.openExamine = true;
    },
    submitReviewForm() {
      this.$refs["formReview"].validate(valid => {
        if (valid) {
          const reviewInfo = {
            reviewId: this.guid(),
            collaborativeId: this.cId,
            reviewResult: this.formReview.reviewResult,
            reviewComments: this.formReview.reviewComments,
          };
          addApproval(reviewInfo).then(response => {
            this.$modal.msgSuccess("审核成功");
            this.openExamine = false;
            this.getReviewList();
            this.getList();
            this.getTwoList();
            this.getThreeList();
          });
        }
      });
    },
    indexMethod(index) {
      return (
        (this.queryParams.pageNum - 1) * this.queryParams.pageSize + index + 1
      );
    },
    indexMethodTwo(index) {
      return (
        (this.queryParamsTwo.pageNum - 1) * this.queryParamsTwo.pageSize +
        index +
        1
      );
    },
    handleQueryEnterprise() {
      this.queryEnterpriseParams.pageNum = 1;
      this.getDeptList();
    },
    resetQueryEnterprise() {
      this.resetForm("queryFormEnterprise");
      this.handleQueryEnterprise();
    },
    handleSelectionChangeEnterprise(selection) {
      this.eIds = selection.map(item => item.deptId);
      this.eName = selection.map(item => item.deptName);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    saveSelectEnterprise() {
      if (this.eIds.toString() == "" || this.eIds.toString() == null) {
        this.$modal.msgError("请先选择合作企业！");
      } else if (
        this.form.cooperationReason == null ||
        this.form.cooperationReason == ""
      ) {
        this.$modal.msgError("请填写合作理由！");
      } else {
        this.$set(this.form, "recipientName", this.eName.toString());
        this.$set(this.form, "recipientId", this.eIds.toString());
        addManagement(this.form).then(response => {
          this.$modal.msgSuccess("新增成功");
          this.open = false;
          this.getList();
          this.getTwoList();
          this.getThreeList();
          this.getDeptList();
        });
      }
    },
    close() {
      this.open = false;
    },
    guid() {
      function S4() {
        return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
      }
      return (
        S4() +
        S4() +
        "-" +
        S4() +
        "-" +
        S4() +
        "-" +
        S4() +
        "-" +
        S4() +
        S4() +
        S4()
      );
    },
  },
};
</script>
<style scoped>
.no-wrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  padding: 0;
}

::v-deep .el-table .cell {
  white-space: nowrap;
}


</style>
